<template>
  <div class="certificateType">
    <van-popup v-model="show" position="bottom" round>
      <van-nav-bar title="主体类型" @click-left="pop_close" @click-right="pop_confirm">
        <template #left>
          <span>取消</span>
        </template>
        <template #right>
          <span>确定</span>
        </template>
      </van-nav-bar>
      <van-radio-group v-model="optionType">
        <van-cell-group>
          <van-cell title="身份证" clickable @click="optionType = '1'" title-style="text-align: left;">
            <template #right-icon>
              <van-radio name="1" />
            </template>
          </van-cell>
          <van-cell title="护照" clickable @click="optionType = '2'" title-style="text-align: left;">
            <template #right-icon>
              <van-radio name="2" />
            </template>
          </van-cell>
          <van-cell title="中国香港居民–来往内地通行证" clickable @click="optionType = '3'" title-style="text-align: left;">
            <template #right-icon>
              <van-radio name="3" />
            </template>
          </van-cell>
          <van-cell title="中国澳门居民–来往内地通行证" clickable @click="optionType = '4'" title-style="text-align: left;">
            <template #right-icon>
              <van-radio name="4" />
            </template>
          </van-cell>
          <van-cell title="中国台湾居民–来往大陆通行证" clickable @click="optionType = '5'" title-style="text-align: left;">
            <template #right-icon>
              <van-radio name="5" />
            </template>
          </van-cell>
        </van-cell-group>
      </van-radio-group>
    </van-popup>
  </div>
</template>
<script>
export default {
  props: {
    optionType: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      show: false
    };
  },
  methods: {
    pop_confirm() {
      this.$emit("pop_confirm", this.optionType);
      this.pop_close();
    },
    pop_close() {
      this.show = false;
      this.optionType = "";
    }
  }
};
</script>
<style lang="scss" scoped></style>
